<!doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/peizhi-styles.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/codemirror.min.css') }}">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.0/codemirror.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.0/mode/javascript/javascript.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

    <title>网络配置生成工具</title>
    <link rel="shortcut icon" href="/img/small-logo.png">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/user-style.css') }}">
  </head>

    <body>
    <script>
        checkAuthentication();
    </script>
      <div>
        <nav id="sticky-navbar-3" class="navbar navbar-expand-lg center-nav transparent navbar-light navbar-clone fixed">
          <div class="container flex-lg-row flex-nowrap align-items-center">
            <div class="navbar-brand w-100"><a href="./index.html"><img src="img/logo-small-svg.svg" alt="" /></a></div>
            <div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
              <div class="offcanvas-header d-lg-none">
                <h3 class="text-white fs-30 mb-0">NetConf</h3><button type="button" data-bs-dismiss="offcanvas" aria-label="Close" class="btn-close btn-close-white"></button>
              </div>
              <div class="offcanvas-body ms-lg-auto d-flex flex-column h-100">
                <ul class="navbar-nav">
                <div class="offcanvas-footer d-lg-none">
                  <div><a href="mailto:1510756862@qq.com" class="link-inverse">1510756862@qq.com</a><!--<br /> <br />-->
                    <nav class="nav social social-white mt-4"><a href="#"><i class="uil uil-twitter"></i></a><a href="#"><i class="uil uil-facebook-f"></i></a><a href="#"><i class="uil uil-dribbble"></i></a><a href="#"><i class="uil uil-instagram"></i></a><a href="#"><i class="uil uil-youtube"></i></a></nav><!-- /.social -->
                  </div>
                </div>
            <div class="navbar-other w-100 d-flex ms-auto">
              <ul class="navbar-nav flex-row align-items-center ms-auto">
                <li class="nav-item"><a data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info" class="nav-link"><i class="uil uil-info-circle"></i></a></li>
                <li class="nav-item d-lg-none"><button class="hamburger offcanvas-nav-btn"><span></span></button></li>
              </ul>
            </div>

        </nav>
        <link rel="shortcut icon" href="img/logo.png" />
        <link rel="stylesheet" href="{{ url_for('static', filename='css/plugins.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/yellow.css') }}">
        <link rel="preload" href="{{ url_for('static', filename='css/thicccboi.css') }}" as="style">
        <div class="content-wrapper">
          <header class="wrapper bg-soft-primary">
            <nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
              <div class="container flex-lg-row flex-nowrap align-items-center">
                <div class="navbar-brand w-100"><a href="/"><img src="img/logo.png" alt="" /></a></div>
                <div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
                  <div class="offcanvas-header d-lg-none">
                    <h3 class="text-white fs-30 mb-0">NetConf</h3><button type="button" data-bs-dismiss="offcanvas" aria-label="Close" class="btn-close btn-close-white"></button>
                  </div>
                  <div class="offcanvas-body ms-lg-auto d-flex flex-column h-100">
                    <ul class="navbar-nav">
                      <li class="nav-item dropdown"></li>
                      <li class="nav-item dropdown">
                        <div class="dropdown-menu dropdown-lg">
                          <div class="dropdown-lg-content">
                            <div>

                            </div>
                            <div>

                            </div>
                          </div>
                        </div>
                    </ul><!-- /.navbar-nav -->
                    
                    <div class="offcanvas-footer d-lg-none">
                      <div><a href="mailto:1510756862@qq.com" class="link-inverse">1510756862@qq.com</a><!--<br /> <br />-->
                        <nav class="nav social social-white mt-4"><a href="#"><i class="uil uil-twitter"></i></a><a href="#"><i class="uil uil-facebook-f"></i></a><a href="#"><i class="uil uil-dribbble"></i></a><a href="#"><i class="uil uil-instagram"></i></a><a href="#"><i class="uil uil-youtube"></i></a></nav><!-- /.social -->
                      </div>
                    </div><!-- /.offcanvas-footer -->
                  </div><!-- /.offcanvas-body -->

                </div><!-- /.navbar-collapse -->
                <div class="navbar-other w-100 d-flex ms-auto">
                  <ul class="navbar-nav flex-row align-items-center ms-auto">
                    <li class="nav-item"><a data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info" class="nav-link"></a></li>
                    <li class="nav-item d-lg-none"><button class="hamburger offcanvas-nav-btn"><span></span></button></li>
                  </ul><!-- /.navbar-nav -->
                </div><!-- /.navbar-other -->
              </div><!-- /.container -->
            </nav><!-- /.navbar -->
            <div id="offcanvas-info-3" data-bs-scroll="true" class="offcanvas offcanvas-end text-inverse">
              <div class="offcanvas-header">
                <h3 class="text-white fs-30 mb-0">NetConf</h3><button type="button" data-bs-dismiss="offcanvas" aria-label="Close" class="btn-close btn-close-white"></button>
              </div>
              <div class="offcanvas-body pb-6">

                <div class="widget mb-8">
                  <h4 class="widget-title text-white mb-3">了解更多</h4>
                  <ul class="list-unstyled">
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#">隐私保护</a></li>
                    <li><a href="#">法律法规</a></li>
                    <li><a href="#">联系我们</a></li>
                  </ul>
                </div><!-- /.widget -->
                <div class="widget">
                  <h4 class="widget-title text-white mb-3">关注我们</h4>
                  <nav class="nav social social-white"><a href="#"><i class="uil uil-twitter"></i></a><a href="#"><i class="uil uil-facebook-f"></i></a><a href="#"><i class="uil uil-dribbble"></i></a><a href="#"><i class="uil uil-instagram"></i></a><a href="#"><i class="uil uil-youtube"></i></a></nav><!-- /.social -->
                </div><!-- /.widget -->
              </div><!-- /.offcanvas-body -->
            </div><!-- /.offcanvas -->
          </header><!-- /header -->
         
         <div class="radio-container">
            <a href="/"><label class="radio-label">开局配置</label></a>
        </div>
        <div class="radio-container">
            <a href="/dhcp"><label class="radio-label">DHCP配置</label></a>
        </div>
        <div class="radio-container">
          <a href="/agg"><label class="radio-label">端口聚合</label></a>
      </div>
  <h3>开局配置</h3>
  <h3>DHCP配置</h3>
<form action="/dhcp" method="post" onsubmit="return validateForm()">
    <a class="device-manufacturer">*设备厂商：</a>
    <div class="radio-container">
        <input type="radio" id="huawei" name="dhcp_manufacturer" value="华为" checked>
        <label for="huawei" class="radio-label">华为</label>
    </div>

    <div class="radio-container">
        <input type="radio" id="huasan" name="dhcp_manufacturer" value="华三">
        <label for="huasan" class="radio-label">华三</label>
    </div>

    <div class="radio-container">
        <input type="radio" id="cisco" name="dhcp_manufacturer" value="思科">
        <label for="cisco" class="radio-label">思科</label>
    </div>

    <div class="radio-container">
        <input type="radio" id="ruijie" name="dhcp_manufacturer" value="锐捷">
        <label for="ruijie" class="radio-label">锐捷</label>
    </div>

    <div class="radio-container">
        <input type="radio" id="zhongxing" name="dhcp_manufacturer" value="中兴">
        <label for="zhongxing" class="radio-label">中兴</label>
    </div>
        <div class="input-group">
            <div class="input-container">
              <label for="dhcp_vlan">创建Vlan:</label>
              <input type="text" id="dhcp_vlan" name="dhcp_vlan" value="10 20">
          </div>
            <div class="input-container">
              <label for="dhcp_mgmt_vlan">管理Vlan:</label>
              <input type="text" id="dhcp_mgmt_vlan" name="dhcp_mgmt_vlan" value="10">
          </div>
          <div class="input-container">
            <label for="mgmt_address">管理地址:</label>
            <input type="text" id="mgmt_address" name="mgmt_address" value="192.168.10.1">
        </div>
    </div>
        <div class="input-group">
            <div class="input-container">
                <label for="dhcp_pool_name">地址池名称：</label>
                <input type="text" id="dhcp_pool_name" name="dhcp_pool_name" value="vlan10">
            </div>

            <div class="input-container">
                <label for="dhcp_network">地址网段：</label>
                <input type="text" id="dhcp_network" name="dhcp_network" value="192.168.10.0">
            </div>

            <div class="input-container">
                <label for="dhcp_mask">子网掩码：</label>
                <input type="text" id="dhcp_mask" name="dhcp_mask" value="255.255.255.0">
            </div>
            </div>
        <div class="input-group">
            <div class="input-container">
              <label for="dhcp_gateway">网关配置：</label>
              <input type="text" id="dhcp_gateway" name="dhcp_gateway" value="192.168.10.254">
          </div>

            <div class="input-container">
                <label for="dhcp_dns">DNS配置：</label>
                <input type="text" id="dhcp_dns" name="dhcp_dns" value="114.114.114.114 8.8.8.8">
            </div>

            <div class="input-container">
              <label for="excluded_ip_address">保留地址：</label>
              <input type="text" id="excluded_ip_address" name="excluded_ip_address" value="192.168.10.1 192.168.10.10">
          </div>
        </div>
    <input class="Generate-configuration" type="submit" value="生成配置">
</form>

<div class="code-container">
  <h2>生成的配置命令：</h2>
  <textarea id="code" rows="10" cols="50">{%for command in config_commands%}
{{command}}{%endfor%}</textarea>
  <button class="copy-btn">复制</button>
  <span class="copy-success">已复制到粘贴板!</span>
</div>
    
<script src="{{ url_for('static', filename='js/script.js') }}"></script>


       <footer class="bg-navy text-inverse">
          <div class="container pt-15 pt-md-17 pb-13 pb-md-15">
            <div class="d-lg-flex flex-row align-items-lg-center">
              <h3 class="display-4 mb-6 mb-lg-0 pe-lg-20 pe-xl-22 pe-xxl-25 text-white">如遇到问题请与我们联系，感谢支持！</h3><a href="https://f.wps.cn/g/7iVJAItY/" class="btn btn-primary rounded-pill mb-0 text-nowrap">我要留言</a>
            </div>
            <!--/div -->
            <hr class="mt-11 mb-12" />
            <div class="row gy-6 gy-lg-0">
              <div class="col-md-4 col-lg-3">
                <div class="widget"><img src="img/small-logo.png" alt="" class="mb-4" />
                  <p class="mb-4">© 2023-2024 网络配置生成工具.</p>
                  <nav class="nav social social-white"><a href="#"><i class="uil uil-twitter"></i></a><a href="#"><i class="uil uil-facebook-f"></i></a><a href="#"><i class="uil uil-dribbble"></i></a><a href="#"><i class="uil uil-instagram"></i></a><a href="#"><i class="uil uil-youtube"></i></a></nav><!-- /.social -->
                </div><!-- /.widget -->
              </div><!-- /column -->
              <div class="col-md-4 col-lg-3">
                <div class="widget">
                  <h4 class="widget-title text-white mb-3">联系我们</h4>
             <img style="width: 150px; height: 150px;" src="/static/images/WeChat.jpg" />
                </div><!-- /.widget -->
              </div><!-- /column -->
              <div class="col-md-4 col-lg-3">
                <div class="widget">
                  <h4 class="widget-title text-white mb-3">了解更多</h4>
                  <ul class="list-unstyled mb-0">
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#">解决方案</a></li>
                    <li><a href="#">项目案例</a></li>
                    <li><a href="#">隐私条款</a></li>
                    <li><a href="#">相关法规</a></li>
                  </ul>
                </div><!-- /.widget -->
              </div><!-- /column -->
              <div class="col-md-12 col-lg-3">
                <div class="widget">
                    
                  <h4 class="widget-title text-white mb-3">电子邮件</h4>
                  <p class="mb-5">您可以发送邮件到：<a href="mailto:1510756862@qq.com" class="hover">1510756862@qq.com</a>联系我们！</p><!-- /.newslet
                  t-wrapper -->
                </div><!-- /.widget -->
              </div><!-- /column -->
            </div>
            <!--/.row -->
            
          </div><!-- /.container -->
          <div style="text-align: center;">
              Copyright © 2023-2024 NetConf · 
              <a href="https://beian.miit.gov.cn" target="_blank" rel="noopener">京ICP备2023036694号-1</a> 
              <!--京公网安备 号-->
          </div>
        </footer>
        <script src="js/plugins.js"></script>
        <script src="js/theme.js"></script>
    </body>
  </html>